workspaces-view: make sure to add spacing between view and controls

The thumbnail controls are not a separate actor in the overview group
yet, so we need to ensure a spacing between them and the workspaces
view.
Instead of exporting the overview spacing, just add a temporary style
class to the workspaces-view actor for it. It will be removed in the
future when we change the layout of overview elements.

https://bugzilla.gnome.org/show_bug.cgi?id=690174

diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index c0764fcfee0bb1a23f665ec45d7bd1ba0253bae3..388b48eaeea67a056a39d171804145b6263d9ebc 100644 (file)
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -620,6 +620,10 @@ StScrollBar StButton#vhandle:active {
     spacing: 32px;
 }
 
+.workspaces-display {
+    spacing: 32px; /* needs to be the same value as #overview-group */
+}
+
 .window-caption {
     spacing: 25px;
 }

diff --git a/js/ui/workspacesView.js b/js/ui/workspacesView.js
index 00f627ba4ae2a8eb8d7972073c8d6e6f7af23679..89eee30d4e793004fc3305f657b7f6b4096882de 100644 (file)
--- a/js/ui/workspacesView.js
+++ b/js/ui/workspacesView.js
@@ -437,13 +437,24 @@ const WorkspacesDisplay = new Lang.Class({
     Name: 'WorkspacesDisplay',
 
     _init: function() {
-        this.actor = new Shell.GenericContainer();
+        this.actor = new Shell.GenericContainer({ style_class: 'workspaces-display' });
         this.actor.connect('get-preferred-width', Lang.bind(this, this._getPreferredWidth));
         this.actor.connect('get-preferred-height', Lang.bind(this, this._getPreferredHeight));
         this.actor.connect('allocate', Lang.bind(this, this._allocate));
         this.actor.connect('parent-set', Lang.bind(this, this._parentSet));
         this.actor.set_clip_to_allocation(true);
 
+        this._spacing = 0;
+        this.actor.connect('style-changed', Lang.bind(this,
+            function() {
+                let node = this.actor.get_theme_node();
+                let spacing = node.get_length('spacing');
+                if (spacing != this._spacing) {
+                    this._spacing = spacing;
+                    this._updateWorkspacesGeometry();
+                }
+            }));
+
         let clickAction = new Clutter.ClickAction()
         clickAction.connect('clicked', Lang.bind(this, function(action) {
             // Only switch to the workspace when there's no application
@@ -854,6 +865,7 @@ const WorkspacesDisplay = new Lang.Class({
         let clipY = y + (fullHeight - clipHeight) / 2;
 
         let widthAdjust = this._zoomOut ? controlsNatural : controlsVisible;
+        widthAdjust += this._spacing;
         width -= widthAdjust;
         if (rtl)
             x += widthAdjust;